import { createRouter, createWebHistory } from 'vue-router'
import type { RouteRecordRaw } from 'vue-router'

const routes: Array<RouteRecordRaw> = [
  // 前台页面全部包裹在 FrontendLayout 下
  {
    path: '/',
    component: () => import('@/views/FrontendLayout.vue'),
    children: [
      { path: '', name: 'home', component: () => import('@/views/HomePage.vue') },
      {
        path: 'news',
        name: 'news',
        component: () => import('@/views/NewsPage.vue'),
        children: [
          { path: '', name: 'news-index', component: () => import('@/views/news/NewsIndexPage.vue') },
          { path: 'video', name: 'news-video', component: () => import('@/views/news/VideoCenterPage.vue') },
          { path: 'industry', name: 'news-industry', component: () => import('@/views/news/IndustryNewsPage.vue') },
          { path: 'company', name: 'news-company', component: () => import('@/views/news/CompanyNewsPage.vue') },
          { path: 'internal', name: 'news-internal', component: () => import('@/views/news/InternalAreaPage.vue') },
          {
            path: 'article/:id', // 新增
            name: 'news-article-detail',
            component: () => import('@/components/content-details/ArticleDetail.vue')
          }
        ]
      },
      { path: 'news/detail/:id', name: 'news-detail', component: () => import('@/views/NewsDetailPage.vue') },
      { path: 'brand', name: 'brand', component: () => import('@/views/BrandPage.vue') },
      { path: 'special-product', name: 'specialProduct', component: () => import('@/views/SpecialProductPage.vue') },
      { path: 'bangkok', name: 'bangkok', component: () => import('@/views/BangkokPage.vue') },
      {
        path: 'products',
        name: 'products',
        component: () => import('@/views/ProductsPage.vue'),
        children: [
          { path: '', name: 'products-home', component: () => import('@/views/new_products/ProductsHome.vue') },
          { path: 'jewelry', name: 'jewelry', component: () => import('@/views/new_products/JewelryPage.vue') },
          { path: 'skin', name: 'skin', component: () => import('@/views/new_products/SkinPage.vue') },
          { path: 'mask', name: 'mask', component: () => import('@/views/new_products/MaskPage.vue') },
          { path: 'makeup', name: 'makeup', component: () => import('@/views/new_products/MakeupPage.vue') },
          { path: 'perfume', name: 'perfume', component: () => import('@/views/new_products/PerfumePage.vue') },
          { path: 'nail', name: 'nail', component: () => import('@/views/new_products/NailPage.vue') },
          { path: 'tattoo', name: 'tattoo', component: () => import('@/views/new_products/TattooPage.vue') },
          { path: 'underwear', name: 'underwear', component: () => import('@/views/new_products/UnderwearPage.vue') },
          { path: 'health', name: 'health', component: () => import('@/views/new_products/HealthPage.vue') }
        ]
      },
      { path: 'design', name: 'design', component: () => import('@/views/ImageDesignPage.vue') },
      { path: 'join', name: 'join', component: () => import('@/views/JoinUsPage.vue') },
      {
        path: '/contact',
        name: 'contact',
        component: () => import('@/views/ContactPage.vue'),
        children: [
          { path: 'recruitment', component: () => import('@/views/contact/RecruitmentPage.vue') },
          { path: 'complaint', component: () => import('@/views/contact/ComplaintPage.vue') },
          { path: 'location', component: () => import('@/views/contact/LocationPage.vue') }
        ]
      }
    ]
  },
  // 后台
  {
    path: '/admin/login',
    name: 'admin-login',
    component: () => import('@/views/admin/Login.vue')
  },
  {
    path: '/admin',
    component: () => import('@/views/admin/Layout.vue'),
    children: [
      { path: '', redirect: '/admin/dashboard' },
      { path: 'dashboard', name: 'admin-dashboard', component: () => import('@/views/admin/dashboard/Index.vue') },
      { path: 'content/list', name: 'admin-content-list', component: () => import('@/views/admin/content/List.vue') },
      { path: 'content/edit/:id?', name: 'admin-content-edit', component: () => import('@/views/admin/content/Edit.vue') },
      { path: 'content/publish', name: 'admin-content-publish', component: () => import('@/views/admin/content/Publish.vue') },
      { path: 'marketing/statistics', name: 'admin-marketing-statistics', component: () => import('@/views/admin/marketing/Statistics.vue') },
      { path: 'marketing/customerservice', name: 'admin-marketing-customerservice', component: () => import('@/views/admin/marketing/CustomerService.vue') },
      { path: 'marketing/seo', name: 'admin-marketing-seo', component: () => import('@/views/admin/marketing/SEO.vue') },
      { path: 'marketing/links', name: 'admin-marketing-links', component: () => import('@/views/admin/marketing/Links.vue') },
      { path: 'appearance/pc', name: 'admin-appearance-pc', component: () => import('@/views/admin/appearance/PC.vue') },
      { path: 'appearance/mobile', name: 'admin-appearance-mobile', component: () => import('@/views/admin/appearance/Mobile.vue') },
      { path: 'application/myapps', name: 'admin-application-myapps', component: () => import('@/views/admin/application/MyApps.vue') },
      { path: 'user/member', name: 'admin-user-member', component: () => import('@/views/admin/user/Member.vue') },
      { path: 'user/admin', name: 'admin-user-admin', component: () => import('@/views/admin/user/Admin.vue') },
      { path: 'security/efficiency', name: 'admin-security-efficiency', component: () => import('@/views/admin/security/Efficiency.vue') },
      { path: 'security/backup', name: 'admin-security-backup', component: () => import('@/views/admin/security/Backup.vue') },
      { path: 'settings/base', name: 'admin-settings-base', component: () => import('@/views/admin/settings/Base.vue') },
      { path: 'settings/mobile', name: 'admin-settings-mobile', component: () => import('@/views/admin/settings/Mobile.vue') },
      { path: 'settings/category', name: 'admin-settings-category', component: () => import('@/views/admin/settings/Category.vue') },
      { path: 'settings/language', name: 'admin-settings-language', component: () => import('@/views/admin/settings/Language.vue') },
      { path: 'settings/thumbwatermark', name: 'admin-settings-thumbwatermark', component: () => import('@/views/admin/settings/ThumbWatermark.vue') }
    ]
  }
]

const router = createRouter({
  history: createWebHistory(import.meta.env.BASE_URL),
  routes
})

export default router